<%--
  Created by IntelliJ IDEA.
  User: taohj
  Date: 2015/1/7
  Time: 14:03
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<div title="预处理 " data-options="closable:false">


  <div style="padding: 10px;margin-top: 10px;">
    <div style="width: 100px;float: left">
      <iframe id="fileuploadIframe" name="ajaxUpload" style="display:none">
      </iframe>
      <form name="fileuploadForm"  method="post" action="preprocessServlet"
            enctype="multipart/form-data"
            target="ajaxUpload">
        <input type="hidden" name="action" value="upload">
        <input type="file" name="file" style="display: none">
        <a id="btn" href="javascript:void(0);" onclick="$(this).prev().click();"
           class="easyui-linkbutton" style="width: 100px">
          打开文件
        </a>
      </form>
    </div>

    <div style="width: 100px;float: left;margin-left: 10px">
      <a id="btn" href="javascript:void(0);" class="easyui-linkbutton" style="width: 100px">
        打开网址
      </a>
    </div>

    <div style="width: 100px;float: left;margin-left: 10px">
      <a id="btn" href="javascript:void(0);" class="easyui-linkbutton" style="width: 100px">
        打开数据库
      </a>
    </div>

    <div style="width: 100px;float: left;margin-left: 10px">
      <a id="btn" href="javascript:void(0);" class="easyui-linkbutton" style="width: 100px">
        生成...
      </a>
    </div>


    <div style="width: 100px;float: left;margin-left: 10px">
      <a id="btn" href="javascript:void(0);" class="easyui-linkbutton" style="width: 100px">
        上一步
      </a>
    </div>


    <div style="width: 100px;float: left;margin-left: 10px">
      <a id="btn" href="javascript:void(0);" class="easyui-linkbutton" style="width: 100px">
        编辑
      </a>
    </div>

    <div style="width: 100px;float: left;margin-left: 10px">
      <a id="btn" href="javascript:void(0);" class="easyui-linkbutton" style="width: 100px">
        另存为
      </a>
    </div>
  </div>

  <div style="clear: both;padding:0px 10px 10px 6px;border: 1px solid rgb(221,221,221)">
    <div style="padding: 6px 0px 6px 10px;">过滤器</div>
    <div>
      <a class="easyui-linkbutton" style="width: 50px;">选择</a>
      <input class="easyui-textbox" style="width: 650px;height: 26px; font-size: 24px" value="全不选"
             readonly>
      <a class="easyui-linkbutton" style="width: 50px;">应用</a>
    </div>
  </div>


  <div>
    <div style="width: 380px;height:300px;float: left;padding: 6px;">
      <div style="border: 1px solid rgb(221,221,221)">
        <div style="padding: 6px 0px 0px 10px;">关系显示</div>
        <div style="padding: 8px 0px 6px 10px;">
          关系：<span name="relationName"></span><br/>
          样本：<span name="numInstances">0</span> &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;属性:<span
                name="numAttributes">0</span>

        </div>
      </div>

      <div style="border: 1px solid rgb(221,221,221);margin-top: 8px;">
        <div style="padding: 6px 0px 0px 10px;">属性</div>
        <div style="padding: 8px 0px 6px 0px;text-align: center">
          <div>
            <a href="javascript:void(0);" class="easyui-linkbutton"
               style="width: 80px;margin-left: 0px">全选</a>
            <a href="javascript:void(0);" class="easyui-linkbutton"
               style="width: 80px;margin-left: 0px">全不选</a>
            <a href="javascript:void(0);" class="easyui-linkbutton"
               style="width: 80px;margin-left: 0px">转换</a>
            <a href="javascript:void(0);" class="easyui-linkbutton"
               style="width: 80px;margin-left: 0px">模式选择</a>
          </div>

          <div style="height: 200px;margin-top: 8px;">
            <table id="attributes_datagrid" class="easyui-datagrid"
                   data-options="fit:true,rownumbers:true">
              <thead>
              <tr>
                <th data-options="field:'code1',width:20,checkbox:true"></th>
                <th data-options="field:'name',width:290">名称</th>
              </tr>
              </thead>
              <tbody>

              </tbody>
            </table>
          </div>

          <div style="margin-top: 10px;">
            <a href="javascript:void(0);" class="easyui-linkbutton"
               style="width: 370px;margin-left: 0px">移除</a>
          </div>
        </div>


      </div>

    </div>
    <div style="width: 390px;height:370px;float: left;">

    </div>
  </div>
</div>

<script>
  $(function () {
    var  preprocess=context.tabs.tabs("getTab","预处理");
    context.preprocess=preprocess;

    var form =preprocess.find("form[name=fileuploadForm]");
    form.find("input[type=file]").on("change", function () {
      var value = $(this).val();

      if (value) {



        form.submit();
        ajaxStart();

      }
    });

    preprocess.load=function(data){
      var datagrid = preprocess.find("#attributes_datagrid");

      datagrid.datagrid("loadData", data.attributes);

      preprocess.find("span[name=numAttributes]").html(data.numAttributes);

      preprocess.find("span[name=numInstances]").html(data.numInstances);

      preprocess.find("span[name=relationName]").html(data.relationName);

    }

  });
</script>
